    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>个人中心</title>
        <script src="js/jquery-3.5.1.min.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript" src="js/vue.js"></script>
        <script type="text/javascript" src="js/bootstrap.js"></script>
        <script type="text/javascript" src="js/jquery.cookie.js"></script>
        <link rel="stylesheet" href="css/bootstrap.css">
    </head>
    <body>
    <div id="outter">
        <a class="btn" @click="selectmyorders">我的订单</a>
        <div id="order" style="width: 100%;height: 100%">
            <table  v-if="orders.length!=0" class="table text-center table-bordered table-hover table-striped bg-info">
                <thead>
                <tr>
                    <td >课程名字</td>
                    <td >上课时间</td>
                    <td >教练</td>
                    <td >课时长度</td>
                    <td >课时费</td>
                    <td >支付状态</td>
                </tr>
                </thead>
                <tr   v-for="order in orders" class="tr-data" >
                    <td v-text="order.course.courseName"></td>
                    <td v-text="order.coachTime.time.timeDescription"></td>
                    <td v-text="">暂无</td>
                    <td v-text="order.courseLength"></td>
                    <td v-text="order.money"></td>
                    <td v-text="order.status"></td>
                    <td ><a  data-toggle='modal' v-if="order.status=1" data-target='#myModal' @click="paymymoney(order)">我上完课了(点击付款)</a></td>
                </tr>
            </table>
        </div>



        <!-- 模态框（Modal） -->
        <div    class="modal fade " id="myModal"  tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog  modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                            &times;
                        </button>
                        <h4 class="modal-title" id="myModalLabel">
                            春天的风 带来夏天的雨
                        </h4>
                    </div>
                    <div class="modal-body">
                       该次课程您需要支付的价格是{{paymoney}} 您确定付款吗?
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" @click="surepay()" data-dismiss="modal">确认
                        </button>
                        <button type="button"   data-dismiss="modal"        class="btn btn-primary ">
                            取消
                        </button>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal -->
        </div>

    </div>




    <script type="text/javascript">
        var zullstr="http://192.168.10.58:11000/user-coach/"
    //全局变量
        var _this;
        var strurl=location.href;
        var studentId=strurl.split("=")[1];
        var app=new Vue({
            el:"#outter",
            data:{
                orders:[],
                studentId:"",
                paymoney:"",
                orderId:"",
                coachId:'',
                coachTimeId:''
            },
            created:function(){
                _this=this;
            },
            methods:{
             selectmyorders:function () {
                 $.ajax({ beforeSend: function (request) {
                         request.setRequestHeader("auth_token", $.cookie("auth_token"));},
                     url:"orders/selectordersbyuserid",
                     type:"post",
                     data:{"studentId":_this.studentId},
                     success:function(data){
                         _this.orders=data.data;
                         console.log(_this.orders);
                     }
                 });
             },
                paymymoney: function (order) {
                   _this.orderId=order.ordersId;
                 // 需要支付的金额
                   _this.paymoney=order.courseLength*order.money;
                   _this.studentId=order.studentId
                   _this.coachId=order.coachId
                   _this.coachTimeId=order.coachTimeId
                },
                surepay:function () {
                    $.ajax({ beforeSend: function (request) {
                            request.setRequestHeader("auth_token", $.cookie("auth_token"));},
                        url:"orders/paymoney",
                        type:"post",
      data:{"studentId":_this.studentId,"paymoney":_this.paymoney,"orderId":_this.orderId,"coachId":_this.coachId,"coachTimeId":_this.coachTimeId} ,
                        success:function(data){
                             var result=data.data;
                            _this.selectmyorders();
                             if (result==1){
                                 alert("余额不足")
                             }
                             if (result==2){
                                 alert("已经测单")
                             }
                             if (result==3){
                                 alert("成功去评论吧")
                             }
                        }
                    });
                }
            },
        });
    </script>
    </body>
    </html>